export default {
  data() {
    return {
      isshow: false,
      viewWidth: 0,
      buttonWidth: 0,
      disabledView: false,
      x: 0,
      transition: false,
    };
  },
  watch: {
    show(newVal) {
      if (this.autoClose) return;
      if (newVal) {
        this.open();
      } else {
        this.close();
      }
    },
  },
  created() {
    if (this.swipeaction.children !== undefined) {
      this.swipeaction.children.push(this);
    }
  },
  beforeDestroy() {
    this.swipeaction.children.forEach((item, index) => {
      if (item === this) {
        this.swipeaction.children.splice(index, 1);
      }
    });
  },
  mounted() {
    this.isopen = false;
    this.transition = true;
    setTimeout(() => {
      this.getQuerySelect();
    }, 50);
  },
  methods: {
    onClick(index, item) {
      this.$emit('click', {
        content: item,
        index,
      });
    },
    touchstart(e) {
      let { pageX, pageY } = e.changedTouches[0];
      this.transition = false;
      this.startX = pageX;
      if (this.autoClose) {
        this.swipeaction.closeOther(this);
      }
    },
    touchmove(e) {
      let { pageX } = e.changedTouches[0];
      this.slide = this.getSlide(pageX);
      if (this.slide === 0) {
        this.disabledView = false;
      }
    },
    touchend(e) {
      this.stop = false;
      this.transition = true;
      if (this.isopen) {
        if (this.moveX === -this.buttonWidth) {
          this.close();
          return;
        }
        this.move();
      } else {
        if (this.moveX === 0) {
          this.close();
          return;
        }
        this.move();
      }
    },
    open() {
      this.x = this.moveX;
      this.$nextTick(() => {
        this.x = -this.buttonWidth;
        this.moveX = this.x;

        if (!this.isopen) {
          this.isopen = true;
          this.$emit('change', true);
        }
      });
    },
    close() {
      this.x = this.moveX;
      this.$nextTick(() => {
        this.x = 0;
        this.moveX = this.x;
        if (this.isopen) {
          this.isopen = false;
          this.$emit('change', false);
        }
      });
    },
    move() {
      if (this.slide === 0) {
        this.open();
      } else {
        this.close();
      }
    },
    onChange(e) {
      let x = e.detail.x;
      this.moveX = x;
      if (x >= this.buttonWidth) {
        this.disabledView = true;
        this.$nextTick(() => {
          this.x = this.buttonWidth;
        });
      }
    },
    getSlide(x) {
      if (x >= this.startX) {
        this.startX = x;
        return 1;
      } else {
        this.startX = x;
        return 0;
      }
    },
    getQuerySelect() {
      const query = uni.createSelectorQuery().in(this);
      query
        .selectAll('.viewWidth-hook')
        .boundingClientRect((data) => {
          this.viewWidth = data[0].width;
          this.buttonWidth = data[1].width;
          this.transition = false;
          this.$nextTick(() => {
            this.transition = true;
          });

          if (!this.buttonWidth) {
            this.disabledView = true;
          }

          if (this.autoClose) return;
          if (this.show) {
            this.open();
          }
        })
        .exec();
    },
  },
};
